{% extends "rules/base.html" %}
{% block sidebar %}
    <div class="panel-heading">
        <h2 class="panel-title">Defined rulesets</h2>
    </div>
    <ul class="panel-body">
        <li>List of rulesets.</li>
    </ul>
    {% if perms.rules.source_edit or perms.rules.ruleset_policy_view %}
        <div class="panel-heading">
            <h2 class="panel-title">Action{% if perms.rules.source_edit and perms.rules.ruleset_policy_view %}s{% endif %}</h2>
        </div>
        <ul class="action panel-body">
            {% if perms.rules.source_edit %}
                <li>
                    <a href="{% url "add_ruleset" %}">Add</a>
                </li>
            {% endif %}
            {% if perms.rules.ruleset_policy_view %}
                <li>
                    <a href="{% url "policies" %}">Import/Export Policies/Filtersets</a>
                </li>
            {% endif %}
        </ul>
    {% endif %}
{% endblock sidebar %}
{% block content %}
    {% if rulesets %}
        <div class="container-fluid">
            <div class="row toolbar-pf">
                <div class="col-sm-12">
                    <div class="row toolbar-pf-results">
                        <div class="col-sm-12">
                            <h5>{{ rulesets|length }} Ruleset{{ rulesets|length|pluralize }}</h5>
                        </div>
                        <!-- /col -->
                    </div>
                    <!-- /row -->
                </div>
                <!-- /col -->
            </div>
            <!-- /row -->
        </div>
        <!-- /container -->
        <div class="container-fluid">
            <div class="list-group list-view-pf list-view-pf-view">
                {% for ruleset in rulesets %}
                    <div class="list-group-item">
                        <div class="list-group-item-header">
                            <div class="list-view-pf-expand">
                                <span class="fa fa-angle-right"></span>
                            </div>
                            <div class="list-view-pf-actions">
                                {% if perms.rules.ruleset_policy_view %}
                                    <a href="{% url "ruleset" ruleset.pk %}">
                                        <button class="btn btn-default">View</button>
                                    </a>
                                {% else %}
                                    <button class="btn btn-default" disabled>View</button>
                                {% endif %}
                                {% if perms.rules.source_edit or perms.rules.ruleset_update_push or perms.rules.source_view %}
                                    <div class="dropdown pull-right dropdown-kebab-pf">
                                        <button class="btn btn-link dropdown-toggle"
                                                type="button"
                                                id="dropdownKebabRight{{ ruleset.pk }}"
                                                data-toggle="dropdown"
                                                aria-haspopup="true"
                                                aria-expanded="true">
                                            <span class="fa fa-ellipsis-v"></span>
                                        </button>
                                        <ul class="dropdown-menu dropdown-menu-right"
                                            aria-labelledby="dropdownKebabRight{{ ruleset.pk }}">
                                            {% if perms.rules.ruleset_update_push %}
                                                <li>
                                                    <a onclick="UpdateRuleset{{ ruleset.id }}()" style="cursor: pointer;">Update ruleset</a>
                                                </li>
                                            {% endif %}
                                            {% if perms.rules.source_edit or perms.rules.ruleset_policy_edit %}
                                                <li>
                                                    <a href="{% url "edit_ruleset" ruleset.pk %}">Edit ruleset</a>
                                                </li>
                                            {% endif %}
                                            {% if perms.rules.source_edit %}
                                                <li>
                                                    <a href="{% url "copy_ruleset" ruleset.pk %}">Copy ruleset</a>
                                                </li>
                                                <li>
                                                    <a href="{% url "delete_ruleset" ruleset.pk %}">Delete ruleset</a>
                                                </li>
                                            {% endif %}
                                            {% if perms.rules.source_view %}
                                                <li>
                                                    <a href="{% url 'changelog_ruleset' ruleset.id %}">Changelog</a>
                                                </li>
                                            {% endif %}
                                        </ul>
                                    </div>
                                {% endif %}
                            </div>
                            <div class="list-view-pf-main-info">
                                <div class="list-view-pf-left">
                                    <span class="fa fa-th list-view-pf-icon-sm"></span>
                                </div>
                                <div class="list-view-pf-body">
                                    <div class="list-view-pf-description">
                                        <div class="list-group-item-heading">{{ ruleset.name }}</div>
                                        <div class="list-group-item-text">Last update: {{ ruleset.updated_date }}.</div>
                                    </div>
                                    <div class="list-view-pf-additional-info">
                                        <div class="list-view-pf-additional-info-item">
                                            <span class="fa fa-external-link"></span>
                                            <strong>{{ ruleset.sources.all.count }}</strong> Source{{ ruleset.sources.all.count|pluralize }}
                                        </div>
                                        <div class="list-view-pf-additional-info-item">
                                            <span class="pficon pficon-security"></span>
                                            <strong>{{ ruleset.rules_count }}</strong> Rule{{ ruleset.rules_count|pluralize }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="list-group-item-container container-fluid hidden">
                            <div class="close">
                                <span class="pficon pficon-close"></span>
                            </div>
                            <div class="row">
                                <div class="col-md-4">
                                    <dl class="dl-horizontal">
                                        {% if ruleset.descr %}
                                            <dt>
                                                Description
                                            </dt>
                                            <dd>
                                                {{ ruleset.descr }}
                                            </dd>
                                        {% endif %}
                                        <dt>
                                            Creation date
                                        </dt>
                                        <dd>
                                            {{ ruleset.created_date }}
                                        </dd>
                                        <dt>
                                            Validity
                                        </dt>
                                        <dd>
                                            {{ ruleset.validity }}
                                        </dd>
                                    </dl>
                                </div>
                                <div class="col-md-4">
                                    <strong>Sources:</strong>
                                    <ul class="list-group">
                                        {% for source in ruleset.sources.all %}
                                            {% if perms.rules.ruleset_policy_view %}
                                                <li class="list-group-item">
                                                    <a href="{% url 'source' source.pk %}">{{ source.name }}</a>
                                                </li>
                                            {% else %}
                                                <li class="list-group-item">
                                                    <a>{{ source.name }}</a>
                                                </li>
                                            {% endif %}
                                        {% endfor %}
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <script>
function UpdateRuleset{{ ruleset.id }}() {
	$("#update_modal").modal('show');
	$.ajax( {
                type:"POST",
                url:"{% url 'update_ruleset' ruleset.id %}",
                success: function(data) {
			if (data['status'] == true) {
				$("#update_modal").modal('hide');
                if (data['redirect'] == true) {
				    window.location = "{% url 'changelog_ruleset' ruleset.id %}";
                }
			} else {
				$("#update_text").text("Error during update: " + data['errors']);
			}
		},
                error: function(data) {
			$("#update_text").text("Error during update");
                },
                timeout: 120000,
	}
  );
}
                    </script>
                {% endfor %}
            </div>
        </div>
        <!-- Modal -->
        <div class="modal bs-example-modal-sm"
             id="update_modal"
             tabindex="-1"
             role="dialog"
             aria-labelledby="UpdateModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="UpdateModalLabel">
                            Please wait...
                        </h4>
                    </div>
                    <div class="modal-body" id="update_text">
                        {% if middleware_has_udpate %}
                            Triggering ruleset update. This window will close when operation is registered.
                        {% else %}
                            {{ scirius_short_title }} is updating ruleset. This window will close when update is over.
                        {% endif %}
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">
                            Close
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <script>
  $(document).ready(function () {
    // toggle dropdown menu
    $('.list-view-pf-actions').on('show.bs.dropdown', function () {
      var $this = $(this);
      var $dropdown = $this.find('.dropdown');
      var space = $(window).height() - $dropdown[0].getBoundingClientRect().top - $this.find('.dropdown-menu').outerHeight(true);
      $dropdown.toggleClass('dropup', space < 10);
    });

    // click the list-view heading then expand a row
    $(".list-group-item-header").click(function(event){
        if(!$(event.target).is("button, a, input, .fa-ellipsis-v")){
            $(this).find(".fa-angle-right").toggleClass("fa-angle-down")
               .end().parent().toggleClass("list-view-pf-expand-active")
               .find(".list-group-item-container").toggleClass("hidden");
        }
    })

    // click the close button, hide the expand row and remove the active status
    $(".list-group-item-container .close").on("click", function (){
        $(this).parent().addClass("hidden")
            .parent().removeClass("list-view-pf-expand-active")
            .find(".fa-angle-right").removeClass("fa-angle-down");
    })

  });
        </script>
    {% else %}
        <p>
            No ruleset. Click on
            <a href="{% url "add_ruleset" %}">
                Add
            </a>
            to add a ruleset.
        </p>
    {% endif %}
{% endblock content %}
